<template>
    <div>
        <page-header title="文章详情" />
        <page-main>
            <el-form :label-position="labelPosition" label-width="100px" :model="detailArticleForm">
                <el-form-item label="文章标题：">
                    <el-input v-model="detailArticleForm.title" disabled />
                </el-form-item>
                <el-form-item label="文章作者：">
                    <el-input v-model="detailArticleForm.name" disabled />
                </el-form-item>
                <el-form-item label="文章封面：">
                    <el-image :src="detailArticleForm.images" />
                </el-form-item>
                <el-form-item label="文章类别：">
                    <el-input v-model="detailArticleForm.category" disabled />
                </el-form-item>
                <el-form-item label="发布时间：">
                    <el-date-picker
                        v-model="detailArticleForm.datatime"
                        disabled
                        type="datetime"                                            
                    />                    
                </el-form-item>
                <el-form-item label="文章内容：">
                    <editor v-model="detailArticleForm.content" disabled />
                </el-form-item>                              
            </el-form>
        </page-main>
        <fixed-action-bar>
            <el-button type="primary" @click="$router.go(-1)">返回</el-button>            
        </fixed-action-bar>
    </div>
</template>

<script>

export default {
    data() {
        return {
            // 表单文本的对齐方式
            labelPosition: 'left', 
            // 表单内容
            detailArticleForm: {}           
        }
    },
    created() {  
        this.detailArticleForm = this.$route.query         
    }
}
</script>
